<template>
  <div class="main">
    <nav-bar class="home-nav">
      <div class="left" slot="left" @click="goBack">
        <van-icon name="arrow-left" size="24"/>
      </div>
      <div slot="center">
        <span v-if="type==2">入库</span>
        <span v-else>出库</span>
      </div>
    </nav-bar>

    <div>
      <div class="item_box">
        <div class="flex_between border-bottom pd10">
          <span class="num">批次编号：{{batchInfo.uuid}}</span>
          <span class="num_date">{{batchInfo.create_date}}</span>
        </div>
        <div class="border-bottom flex_between fz14 pd10">
          <span class="">种植基地：<span class="color_main">{{batchInfo.base_name}}</span></span>
        </div>
        <div class="border-bottom flex_between fz14 pd10">
          <span class="">批次名称：<span class="color_main">{{batchInfo.name}}</span></span>
        </div>
        <div class="border-bottom flex_between fz14 pd10">
          <span>开始时间：<span class="color_main">{{batchInfo.start_time}}</span></span>
          <span>结束时间：<span class="color_main">{{batchInfo.end_time}}</span></span>
        </div>
      </div>
    </div>

    <record-view :records="recordList">
      <span v-if="type==2">入库记录</span>
      <span v-else>出库记录</span>
    </record-view>

    <div class="add_btn" @click="showPopup">
      <van-button type="primary" color="#1692f2" block>
        <span>{{title}}</span>
      </van-button>
    </div>

    <van-dialog v-model="show" :title="title" :beforeClose="beforeClose" show-cancel-button>
      <van-field
        v-model="num"
        center
        clearable
        label=""
        placeholder="请输入入库数量"
      >
        <template #extra>
          <span>件/箱/包</span>
        </template>
      </van-field>
    </van-dialog>

  </div>
</template>

<script>
  import Util from "@/common/util";
  import NavBar from "@/components/common/navbar/NavBar";
  import ItemView from "@/components/content/ItemView";
  import recordView from "./childComps/recordView";

  export default {
    name: "outView",
    components: {
      NavBar,
      ItemView,
      recordView
    },
    data() {
      return {
        syuid:'',
        type: 2,
        batch_id: '',
        show: false,
        num: 0,
        title: '',
        batchInfo: {
          uuid: '',
          name: '',
          create_date: '',
          base_name: '',
          start_time: '',
          end_time: ''
        },
        recordList: [],
      }
    },

    created() {
      this.syuid = Util.storage.get('syuid');
      this.type = this.$route.query.type;
      this.batch_id = this.$route.query.bid;
      console.log('batch_id',this.batch_id)
      this.getBatchInfo();
      this.getRecord();
      this.type == 2 ? this.title = '我要入库' : this.title = '我要出库';
    },

    methods: {
      getBatchInfo() {
        let that = this;
        that.$http.get('/api/MobileAadminApi/getBatchtDeail', {id: that.batch_id}, r => {
          console.log('批次详情', r)
          that.batchInfo = r.data;
        })
      },

      getRecord() {
        let that = this;
        console.log('type',that.type)
        that.$http.get('/api/MobileAadminApi/getWarehouseList', {batch_id: that.batch_id, type: that.type}, r => {
          console.log('库r：', r)
          that.recordList = r.data;
        })
      },

      beforeClose(action, done) {
        let that = this;
        if (action === 'confirm') {
          if (that.num == 0) {
            that.$toast('数量不能为0！');
            done(false);
            return;
          }

          const params = {
            batch_id: that.batch_id,
            type: that.type,
            syuid:that.syuid,
            num: that.num
          };
          console.log('params',params);
          that.$http.post('/api/MobileAadminApi/addWarehouse', params, r => {
            console.log('出入库r：',r)
            that.$toast(r.info)
            setTimeout(done, 500);

            that.$router.replace({
              path: '/refresh_store',
              query: {
                bid: that.batch_id,
                type: that.type,
                t: Date.now()
              }
            });

          });

        } else {
          done();
        }
      },

      goBack() {
        this.$router.go(-1);
      },

      showPopup() {
        this.show = true
      },

    }
  }
</script>

<style scoped>

</style>
